import React from 'react';
import ReactDom from 'react-dom';
import './selectTool.scss';
import { api } from 'js/api/api';
import Button from 'views/component/button/button';
import utils from 'js/core/utils';
import playerStore from 'js/store/playerStore';
// import { observer, inject } from 'mobx-react';

class SelectTool extends React.Component {
    constructor() {
        super()
    }
    componentDidMount() {
    }
    toolSetUp = (bagIndex) => {
        api('toolSetUp', { toolType: this.props.toolType, bagIndex: bagIndex }, (err, data) => {
            this.props.close();
            if (this.props.complete) {
                this.props.complete();
            }
        });
    }
    render() {
        let bag = playerStore.player.bag;
        let propName = window.propName;
        let itemConfig = window.totalConfig.item;
        let items = bag.items;
        return <div id="selectTool">
            {items.map(item => {
                if (item) {
                    let itemConfigInfo = itemConfig[item.templateId];
                    if (itemConfigInfo.toolType && itemConfigInfo.toolType === this.props.toolType) {
                        return <Button className="toolItem" key={item.pos} onClick={() => { this.toolSetUp(item.pos) }}>
                            {propName[item.templateId]}</Button>
                    }
                }
            })}
        </div>
    }
}

export default SelectTool;